import classNames from 'classnames';
import React from 'react';

import type { IBlankMod } from './data.d';
import styles from './index.module.less';

const ExceptionMod = ({
  className,
  children,
  showBtn,
  height,
  noborder,
  showImg,
  imgSrc,
  btnText,
  horizontal,
  onClick = () => {},
}: IBlankMod) => {
  const clazz = classNames(styles.container, styles.error, className, {
    [styles.horizontal]: horizontal,
    [styles.bordered]: !noborder,
  });
  return (
    <div className={clazz} style={{ height }}>
      {showImg ? (
        <div className={styles.imgbox}>
          <img src={imgSrc} alt="" />
        </div>
      ) : null}
      <div className={styles.desc}>{children}</div>
      {showBtn ? (
        <div className={styles.action}>
          {!horizontal ? (
            <button onClick={onClick} type="button">
              {btnText}
            </button>
          ) : (
            <a href="javascript:void(0)" onClick={onClick}>
              {btnText}
            </a>
          )}
        </div>
      ) : null}
    </div>
  );
};

export default ExceptionMod;
